
<template>
  <!-- <a-cascader :value="selectValue" :options="allList" placeholder="选择行业编码" @change="changeFunc" /> -->
  <a-select
      v-model:value="selectValue"
      show-search
      :placeholder="placeholder"
      style="width: 200px"
      :options="vdata.proxyList"
      :filter-option="filterOption"
      :disabled="props.disabled"
      :allowClear="true"
      @change="onChange"
    ></a-select>
  <!-- <a-auto-complete
    
        v-model:value="selectValue"
        :options="vdata.proxyList"
        placeholder="请选择机构"
        @select="onSelect"
        @change="onChange"
        :filter-option="filterOption"
        :allowClear="true"
        style="width: 300px"
    >
        <template #option="item">
        {{ item.agentName + " [ " + item.agentNo + " ]" }}
        </template>
    </a-auto-complete> -->
</template>
<script lang="ts" setup>
import { defineProps, defineEmits, computed,reactive } from 'vue'
import { API_URL_PROXY_LIST, req } from '@/api/manage'
// 定义组件的传入参数 
const props = defineProps({
    value: { type: String, default: '' },
    disabled: { type: Boolean, default: false },
    placeholder: { type: String, default: '请选择机构' }
})

// emit： 向父组件进行通讯。 
const emit = defineEmits(['update:value','change'])

// 计算属性 
const selectValue = computed(() => {
   if (props.value){
    return props.value //[queryOne(props.value), props.value]
  }
  return null
})
const vdata = reactive({
      proxyList:[]
})
// 初始化机构数据
function init(){
    // console.log('init',window.localStorage.getItem('proxyList'))
    let proxyData = window.localStorage.getItem('proxyList')
    if(proxyData){
        vdata.proxyList = JSON.parse(proxyData)
    }else{
        getProxyList()
    }
}
init()

function getProxyList(){
      req.list(API_URL_PROXY_LIST, { 'pageSize': -1, 'state': 1 }).then(res => { // 机构下拉选择列表
        vdata.proxyList = res.records.map(item=>{
          item.label = item.agentName
          item.value = item.agentNo
          return item
        })
        window.localStorage.setItem('proxyList',JSON.stringify(vdata.proxyList))
      })
    }
    
    // 选择机构相关方法
    const onChange = (value, option) => {
        emit('change', option)
        emit('update:value', value || '')
    //   emit('update:value', option.agentName)
    };
    
    interface Option {
      value: string;
      label: string;
    }
    const filterOption = (input: string, option: Option) => {
          return option.value.indexOf(input) >= 0 || option.label.toUpperCase().indexOf(input.toUpperCase()) >= 0;
        };
    // ------选择机构相关方法


</script>

